<template>
  <div class="keepRecord">
    <van-nav-bar title="设备保养记录" left-arrow="" @click-left='goBack()'>

    </van-nav-bar>
    <!-- 全部保养记录 -->
    <div class="keepCard" v-show="!isLastTime" v-for="(item, index) in info" :key="index">
      <div class="info">
        <div class="numCell">
          <van-cell title="设备名称" :value="item.facilityname" value-class='num'></van-cell>
        </div>
        <van-cell title="设备编号" :value="item.id"></van-cell>
        <van-cell title="所属区域" :value="item.areaName"></van-cell>
        <van-cell title="保养周期" :value="item.cycle"></van-cell>
        <van-cell title="上一次保养时间" :value="item.preRepairTime"></van-cell>
        <van-cell title="保养内容" :value="item.curContent"></van-cell>
        <van-cell title="计划保养时间" :value="item.planRepairTime"></van-cell>
        <van-cell title="实际保养时间" :value="item.curRepairTime"></van-cell>
        <van-cell title="保养次数" :value="item.rNumbers"></van-cell>
        <van-cell title="保养员" :value="item.rUserName"></van-cell>
        <van-cell title="保养部门" :value="item.rDepName"></van-cell>
      </div>
    </div>

    <!-- 上一次保养记录 -->
    <div class="keepCard" v-show="isLastTime">
      <div class="info">
        <div class="numCell">
          <van-cell title="设备编号" :value="lastInfo.id" value-class='num'></van-cell>
        </div>
        <van-cell title="设备名称" :value="lastInfo.facilityname"></van-cell>
        <van-cell title="设备区域" :value="lastInfo.areaName"></van-cell>
        <van-cell title="保养周期" :value="lastInfo.cycle"></van-cell>
        <van-cell title="上一次保养时间" :value="lastInfo.preRepairTime"></van-cell>
        <van-cell title="保养内容" :value="lastInfo.curContent"></van-cell>
        <van-cell title="计划保养时间" :value="lastInfo.planRepairTime"></van-cell>
        <van-cell title="实际保养时间" :value="lastInfo.curRepairTime"></van-cell>
        <van-cell title="保养次数" :value="lastInfo.rNumbers"></van-cell>
        <van-cell title="保养员" :value="lastInfo.rUserName"></van-cell>
        <van-cell title="保养部门" :value="lastInfo.rDepName"></van-cell>
        <van-cell title="超期天数" :value-class="lastInfo.mNumbers>0?'excessTime':''" :value="lastInfo.mNumbers"></van-cell>
      </div>
    </div>
    <van-button size="large" @click="show=true" color="#62cff9">保养</van-button>
    <van-popup v-model="show">
      <p class="genderTop">保养</p>
      <van-cell title="保养类别">
        <div v-for="(item,index) in categorys" :key="index">
          <van-radio-group v-model="radio">
            <van-cell-group>
              <van-cell :title="item.name" clickable @click="radio=item.id" :border="false">
                <van-radio slot="right-icon" :name="item.id" />
              </van-cell>

            </van-cell-group>
          </van-radio-group>
        </div>


      </van-cell>
       <van-field v-model="lastInfo.cycle" :clearable="true" :error-message="cycleErrMsg" label="保养周期(天)" placeholder="请输入保养周期"></van-field>
      <van-field label="保养内容" :clearable="true"  type="textarea" rows='3' autosize v-model="lastInfo.curContent" :border="true"
        placeholder="请输入保养内容"></van-field>

      <van-button type="primary" color="#62cff9" @click='updateMantence'>确定</van-button>
    </van-popup>
  </div>
</template>

<script>
  let moment = require('moment')
  import {Toast} from 'vant'
  export default {
    data() {
      return {
        radio:null,
        // radio1: 2,
        cycleErrMsg:'',
        keepCycle:'',
        choiceCategory:'',
        categorys:[],
        content:'',
        isLastTime: true,
        searchData: '',
        facilityname: this.$route.params.facilityname,
        info: [],
         errMsg:'',
        lastInfo: {},
        planrepairtime:'',
        prerepairtime:'',
        rfacilityid:'',
        curcontent:'',
        cycle:'',
        show:false,
      }
    },
    created() {
      this.getAllInfo()
      this.getCategoty()
    },
    watch: {
      /* radio(newVal) {
        if (newVal == '1') {
          this.isLastTime = false
        } else {
          this.isLastTime = true

        }
      }, */
      'lastInfo.cycle'(newVal){
        if((/[^0-9]/).test(newVal)){
          this.cycleErrMsg = '请输入整数'
        }else{
          this.cycleErrMsg = ''
        }
      },
    },
    methods: {

      //获取保养类别
      getCategoty() {
        this.$axios.post("Repair/selectGenre.do").then(res => {
          if (res.data.status === 200) {
            this.categorys = res.data.msg;
          }
        });
      },
      updateMantence() {

        if(this.errMsg||this.cycleErrMsg) return
        let newTime = moment(new Date()).format('YYYY-MM-DD')
        this.$axios.post('Repair/updateRepair.do',{
          curcontent:this.lastInfo.curContent,
          cycle:this.lastInfo.cycle,
          genreid:this.radio,
          prerepairtime:this.lastInfo.curRepairTime,
          rfacilityid:this.lastInfo.facilityname
        }).then(res=>{
          if(res.data.status===200){
            Toast.success('保养成功！')
            this.getAllInfo()
          }
        })
        this.show = false
      },

      getAllInfo() {
        this.info = []
        this.$axios.post('Repair/selectRepair.do', {
          facilityname: this.facilityname,
          rUserName: ''
        }).then(res => {
          if (res.data.status === 200) {
            this.info = res.data.msg
          }
          this.lastInfo = this.info[0]
          if(this.lastInfo.fDepName === null){
            return
          }
          this.radio = this.lastInfo.fDepName === 'A'?'1':'2'

        })
      }
    }
  }
</script>

<style scoped="scoped">
  .excessTime{
    color: red;
  }
  .van-cell-group .van-cell{
    padding: 0;
    margin-right: 0.8rem;
  }
  .keepRecord .van-cell__title{
    flex: 0.66;
    margin: 0 3px;
  }

  .van-cell__value{
    display: flex;
  }

  .van-dropdown-menu {
    height: 1.25rem;
    line-height: 1.25rem;
  }
  .genderTop {
    font-size: .87rem;
    text-align: center;
  }
  .van-popup--center .van-button {
    float: right;
    border-radius: .4rem;
    line-height: 1.7rem;
    height: 1.7rem;
    margin-top: .7rem;
  }
  .van-popup--center {
    padding-right: .7rem;
    padding-top: .3rem;
    top: 40%;
    border-radius: 8px;
    width: 76%;
    padding-bottom: 1rem;
  }

  .van-button--large {
    margin: 1rem;
    border-radius: 0.5rem;
    width: 93%;
    height: 2rem;
    line-height: 2rem;
    background: #67B1FB;
    color: #fff;
  }
.keepCard[data-v-29fb66f1] {
  margin-top: 1rem;
  }



  .title {
    color: #222222;
  }


  .astoast {
    font-size: .86rem;
  }

  .numCell {
    padding-bottom: .5rem;
    border-bottom: 1px solid #EEEEEE;
    padding-top: .4rem;
  }

  .num {
    font-size: .9rem;
    color: #222;
    font-weight: bold;
  }

  .keepCard {
    padding: .6rem;
  }

  .keepCard .van-cell {
    font-size: .7rem;
    line-height: .9rem;
  }

  .info {
    box-shadow: 3px 3px 5px #ADADAD;
  }
</style>
